<script setup lang="ts">
import { useRoute,useRouter } from 'vue-router';

const route =useRoute()
function checkClick(){
    router.push(   {
     name: 'step4',
     query: {
       year:route.query.year,
       month:route.query.month,
       day:route.query.day,
       hour:route.query.hour,
       min:route.query.min,
       sec:route.query.sec,
       nmonth:route.query.nmonth,
       nday:route.query.nday,
       bed:  route.query.bed,
       kind:  route.query.kind,
       price:  route.query.price,
       proid:route.query.proid,
       start: route.query.start,
       img:route.query.img,
       phone:route.query.phone,
       name:route.query.name,
       nprice:route.query.nprice
        }
})
}
const router =useRouter()
function backClick(){
    router.go(-1);
}
</script>
<template>
    <main class="box">
    <div class="content"> 
        <div class="toptitle">
    <van-icon @click="backClick()" class="back" size="50" name="arrow-left" />
    <div class="pay">支付订单</div>
   </div>
   <van-image
   class="img"

  src="https://img.axureshop.com/c2/e9/7b/c2e97b96ebac43fdaa2b01538e82639f/images/%E6%94%AF%E4%BB%98%E6%88%90%E5%8A%9F/u1217.png"
/>
<div class="paysuccess">支付成功</div>
<van-button class="submitbutton" @click="checkClick" lain type="primary">查看订单</van-button>
    </div>
    </main>
</template>

<style lang="scss" scoped>
main,.box,.content{
    width: 100%;
    height: 100%;
    background-color: #fbfbfb;
}
.toptitle{
    width: 100%;
    height: 0.5rem;
    position: relative;
    .bacK{
        position: absolute;
        top: 5px;
        left: 10px;
    }
    .pay{
        font-size: 20px;
        position: absolute;
        top: 15px;
        left:calc(50% - 35px);
    }
}
.img{
    width:70px;
    height:70px;
    margin: 50px 174px 20px
}
.paysuccess{
    width: 140px;
font-size: 30px;
font-weight: 800;
margin: 10px auto;
text-align: center;
}
.submitbutton{
    width: 180px;
    height: 0.5rem;
    border-radius: 5px;
 margin: 50px  120px;
}
</style>
    